<template>
   <div class="container">
       <nav>
         <h1>单身汪保护协会</h1>
       </nav>
       <section class="content">
          <div @click="login()">登录</div>
          <div @click="regist()">注册</div>
       </section>
       <section class="main">
         <router-link to="/home">进入主题</router-link>
       </section>
   </div>
</template>
<script>
import axios from 'axios'

export default {
      data () {
          return{

          }
      },
       methods: {
        login:function(){
            this.$router.push({path: "/login"})
        },
        regist:function(){
            this.$router.push({path: "/regist"})
        }
       },
       mounted() {
       }
}
</script>
<style lang="scss">
 .container{
   flex: 1;
height: 100%;
width: inherit;
background-image: url('../../static/img/timg.jpg');
background-size: 100% 100%;
 }
 nav{
   text-align: center;
   padding: 10px 0;
 }
.content{
  display: flex;
  text-align: center;
}
.content div{
  text-align: center;
  flex: 1;
  cursor: pointer;
  border: 1px solid #eee;
}
.main{
  text-align: center;
}
.main a{
  text-decoration: none;
  cursor: pointer;
  font-size: 24px;
  font-weight: 800;
}
</style>
